<template>
  <div>
    <a-modal v-model:visible="visible">
      <template #title> 产酒管理 </template>
      <a-form :model="form" :rules="rules" ref="formRef" @submit="handleSubmit">
        <a-form-item field="winetype_id" label="生产酒类型">
          <a-select
            placeholder="请选择生产酒类型"
            v-model="form.winetype_id"
            allow-clear
            @change="winetypeChange"
          >
            <a-option
              v-for="(item, i) in winetypedata"
              :key="i"
              v-model="item.winetype_id"
              :value="item.winetype_id"
              :label="item.wine_name"
            ></a-option>
          </a-select>
        </a-form-item>
        <a-form-item field="produce_box" label="生产箱数">
          <a-input
            v-model="form.produce_box"
            placeholder="请输入生产箱数"
            @change="boxChange"
            allow-clear
            ><template #append> 箱 </template></a-input
          >
        </a-form-item>
        <a-form-item field="produce_bottle" label="生产瓶数">
          <a-input
            v-model="form.produce_bottle"
            placeholder="请输入生产瓶数"
            allow-clear
            ><template #append> 瓶 </template></a-input
          >
        </a-form-item>
        <a-form-item field="product_batch" label="生产批次">
          <a-input
            v-model="form.product_batch"
            placeholder="请输入生产批次"
            allow-clear
            ><template #append> 批 </template></a-input
          >
        </a-form-item>
        <a-form-item field="produce_time" label="生产时间">
          <a-date-picker
            style="width: 100%"
            v-model="form.produce_time"
            placeholder="请选择生产时间"
          />
        </a-form-item>
        <a-form-item field="product_costom" label="是否定制">
          <a-select v-model="form.product_costom" placeholder="请选择是否定制">
            <a-option value="0">否</a-option>
            <a-option value="1">是</a-option>
          </a-select>
        </a-form-item>
        <a-form-item
          field="product_type"
          label="入库状态"
          tooltip="库房系统暂未完善,统一未入库"
        >
          <a-select
            placeholder="请选择生产状态"
            v-model="form.product_type"
            allow-clear
            disabled
          >
            <a-option
              v-for="(item, i) in productTypeList"
              :key="i"
              v-model="item.id"
              :value="item.id"
              :label="item.name"
            ></a-option>
          </a-select>
        </a-form-item>
        <a-form-item
          field="store_time"
          label="入库时间"
          tooltip="库房系统暂未完善,无需选择"
        >
          <a-date-picker
            style="width: 100%"
            v-model="form.store_time"
            placeholder="请选择入库时间"
            disabled
          />
        </a-form-item>
        <a-form-item field="store_time" label="备注">
          <a-textarea
            v-model="form.product_remark"
            placeholder="请输入备注"
            allow-clear
            show-word-limit
            :max-length="200"
          />
        </a-form-item>
      </a-form>
      <template #footer>
        <a-button type="primary" @click="saveproducedata">确定</a-button>
        <!-- <a-button type="primary" @click="$refs.formRef.resetFields()">Reset</a-button> -->
      </template>
    </a-modal>
  </div>
</template>

<script lang="ts" setup>
import { reactive, ref } from 'vue';
import { saveProducedata } from '@/api/producetion';
import { Message } from '@arco-design/web-vue';
const visible = ref(false);
const props = defineProps({
  winetypedata: {
    type: Array,
  },
  getProducedataInfo:{
    type:Function,
  }
});
const wineCase = ref(0)
// 箱数变化
const boxChange = (val) => {
  form.produce_bottle = val * wineCase.value;
}
// 酒类变化
const winetypeChange = (val) => {
  wineCase.value = props.winetypedata.find((item) => item.winetype_id === val)?.wine_case;
}
const saveproducedata = () => {
  formRef.value.validate().then(async (res) => {
    if (res === undefined) {
      form.produce_bottle = parseInt(form.produce_bottle);
      const { data, code, message } = await saveProducedata(form);
      Message.success(message);
      if (code === 200) {
        props.getProducedataInfo(1)
        visible.value = false;
        formRef.value.resetFields();
      }
    }
  });
};
const handleSubmit = ({ values, errors }) => {
  console.log('values:', values, '\nerrors:', errors);
};
const formRef = ref();
const form = reactive({
  winetype_id: '',
  produce_box: '',
  produce_bottle: '',
  produce_time: '',
  product_type: '1',
  product_batch: '',
  product_costom: '0',
  store_time: null,
  product_remark:'', //
});
const productTypeList = ref([
  { id: '1', name: '未入库' },
  { id: '2', name: '已入库' },
]);
const rules = {
  winetype_id: [
    {
      required: true,
      message: '请选择酒类型',
    },
  ],
  produce_box: [
    {
      required: true,
      message: '请输入生产箱数',
    },
  ],
  produce_bottle: [
    {
      required: true,
      message: '请输入生产瓶数',
    },
  ],
  produce_time: [
    {
      required: true,
      message: '请选择生产时间',
    },
  ],
};

const openDialog = () => {
  visible.value = true;
};

defineExpose({
  openDialog,
});
</script>


<style scoped lang="less">
</style>